<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		 <script src="../../js/vue.min.js"></script>
	</head>
	<body>
		<!--当需要应用多个class时，可以使用数组语法，给:class绑定一个数组，应用一个class列表：：-->
		<style>
		    .red88{
		      color: red;
		    }
		    .blue88{
		      background: blue;
		    }
			.yellow88{
			  color: yellow;
			}
		  </style>



	 <div id="app">
	     <div :class="[t1, t2]">111111111111111</div>
		 
		 <!--也可以使用三元表达式来根据条件切换class，例如下面的示例-->
		 <div :class="[flag ? t1 : t3]">222222222</div>
	 </div>
	  
	  <script>
	      var app = new Vue({
	          el: "#app",
	          data: {
				 flag: false,
	             t1: "red88",
	             t2: "blue88",
				 t3: "yellow88",
	        }
	    });
	</script>
		
		
		
		
</html>
